<template>
	<view>
		<view class="page">



			<movable-area>
				<movable-view  direction="all" inertia="true" out-of-bounds="true" scale="true" @scale="onScale"  scale-min="0.8" scale-max="4" :scale-value="scale">
					<image  :src="img" mode="widthFix" ></image>
				</movable-view>
			</movable-area>

	

			<view class="buttom">


			</view>

		</view>
	</view>
</template>

<script>
	export default {
		name: "check_photo",
		data() {
			return {

			}
		},
		methods: {
			img: "https://i0.hdslb.com/bfs/feed-admin/b553167dacf13c456fda980ed4b32e0b22d0664a.jpg@880w_388h_1c_95q"
		}
	}
</script>

<style>
	.page {
		width: 100%;
		height: 1000upx;
		background: #ececec;
	}

	.buttom {
		bottom: 0;
		position: absolute;
		width: 100%;
		height: 120upx;
		background: rgba(76, 76, 76, 0.5);
	}


	movable-view {
		display: flex;
		align-items: center;
		justify-content: center;
		width: auto;
		background: #255BBA;
	}

	movable-area {
		height: 100%;
		width: 170%;
		position: fixed;
		overflow: hidden;
	}

	movable-view image {
	}
</style>
